import React from 'react'
import { ScaleS, ScaleT } from 'src/utils/ScreenUtil'
import { Text, View, StyleSheet } from 'react-native'
import PropTypes from 'prop-types'
import CustomImage from '../image/CustomImage'

const workNatureMap = new Map([
  ['全职', require('@/imgC/home/tag_quanzhi.png')],
  ['兼职', require('@/imgC/home/tag_jianzhi.png')],
  ['实习', require('@/imgC/home/tag_shixi.png')]
])
export default class JobIntentionCardContent extends React.PureComponent {
  render () {
    const { dataSource: { workNature, jobPlace, workPlace, workCategory } } = this.props
    const workNatureValue = workNature && workNature[0]
    return (
      <View style={styles.container}>
        <View style={styles.view1}>
          <Text style={styles.title}>{workNatureValue}</Text>
          {workNatureMap.has(workNatureValue) &&
          <CustomImage style={styles.jobTypeImg} source={workNatureMap.get(workNatureValue)}/>}
          <Text style={styles.jobTypeLocation}>{`${jobPlace}·${workPlace.join(' ')}`}</Text>
        </View>
        <View style={styles.jobTypeItemViews}>
          {workCategory && workCategory.map(e => {
            return e ? (
              <View key={e} style={styles.jobTypeItemView}>
                <Text style={styles.jobTypeItemLabel}>{e}</Text>
              </View>
            ) : null
          })}
        </View>
      </View>
    )
  }
}
JobIntentionCardContent.propTypes = {
  dataSource: PropTypes.object
}
JobIntentionCardContent.defaultProps = {
  dataSource: {}
}
const styles = StyleSheet.create({
  container: {
    // flex: 1,
    padding: ScaleS(20)
  },
  view1: {
    height: ScaleS(21),
    flexDirection: 'row',
    alignItems: 'center'
  },
  title: {
    fontSize: ScaleT(17),
    fontWeight: '400',
    color: '#444444',
    marginRight: ScaleS(7)
  },
  jobTypeImg: {
    width: ScaleS(18),
    height: ScaleS(21)
  },
  jobTypeLocation: {
    flex: 1,
    textAlign: 'right',
    color: '#A5A5A5',
    fontSize: ScaleT(12),
    fontWeight: '400'
  },
  jobTypeItemViews: {
    flexDirection: 'row',
    alignItems: 'center',
    marginTop: ScaleS(10)
  },
  jobTypeItemView: {
    backgroundColor: 'rgba(216,216,216,0.205)',
    borderRadius: ScaleS(14),
    height: ScaleS(28),
    paddingHorizontal: ScaleS(15),
    marginRight: ScaleS(10),
    justifyContent: 'center',
    alignItems: 'center'
  },
  jobTypeItemLabel: {
    color: '#999999',
    fontSize: ScaleT(12),
    fontWeight: '400'
  }
})
